{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% block content %}
    <div id="content">

    <!-- Begin Page Content -->
    <div class="container-fluid">

        <!-- Page Heading -->
        <h1 class="h3 mb-2 text-gray-800">审计日志</h1>

        <!-- DataTales Example -->
        <div class="card shadow mb-4">
            <div class="card-header py-3">
                <button id="add_salt" class="btn btn-sm mr-2" > </button>
            </div>
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>用户</th>
                                <th>动作</th>
                                <th>额外信息</th>
                                <th>创建时间</th>

                            </tr>
                        </thead>
                        <tfoot>
                            <tr>
                                <th>ID</th>
                                <th>用户</th>
                                <th>动作</th>
                                <th>额外信息</th>
                                <th>创建时间</th>
                            </tr>
                        </tfoot>
                        <tbody>

                        </tbody>
                    </table>
                </div>
            </div>
        </div>

    </div>
    <!-- /.container-fluid -->
    <div id="load" style="display:none; text-align:center; position:fixed; top:0; left:0; right:0; bottom:0; z-index:1200; background:url(/static/img/loading.gif) center center no-repeat;"></div>
{% endblock content %}
{% block js %}
    <script type="text/javascript">
        // 初始化 DataTable
        document.addEventListener('DOMContentLoaded', function () {
            // 检查 DataTable 是否已经初始化
            if ($.fn.DataTable.isDataTable('#dataTable')) {
                $('#dataTable').DataTable().destroy(); // 销毁已有实例
            }

            $('#dataTable').DataTable({
                "order": [[0, 'desc']],
                "pageLength": 25,
                "processing": true,
                "serverSide": true,
                "ajax": "/get_audit_info/",
                "columns": [
                    { "data": "id" },
                    { "data": "user__username" },
                    { "data": "action" },
                    { "data": "extra_content" },
                    { "data": "create_time" },
                ]
            });
        });
    </script>
{% endblock %}